<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <title>微首页</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <meta name="author" content="http://weibaby.cc"/>
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="Expires" content="0"/>
    <link rel="shortcut icon" href="mobile/baby/image/favicon.png">
    <link rel="stylesheet" href="mobile/bootstrap-3.3.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="mobile/font-awesome-4.4.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="mobile/swiper-3.1.2/css/swiper.min.css">
    <link rel="stylesheet" href="mobile/baby/theme/deafuat.css"/>
    <script src="mobile/jquery-1.11.1/jquery-1.11.1.min.js"></script>
    <script src="mobile/jquery-1.11.1/placeholdem.min.js"></script>
    <script src="mobile/bootstrap-3.3.2/js/bootstrap.min.js"></script>
    <script src="mobile/swiper-3.1.2/js/swiper.min.js"></script>
</head>
<body class="home-body">
<!--自动加载组件-->
<div class="pre-loader">
    <div class="load-con">
        <img src="mobile/baby/image/logo.png" alt="">

        <div class="spinner">
            <div class="bounce0">B</div>
            <div class="bounce1">A</div>
            <div class="bounce2">B</div>
            <div>Y</div>
        </div>
    </div>
</div>
<header style="height: 200px;">
    <div class="swiper-container">
        <div class="parallax-bg" style="background-image:url('mobile/baby/image/banner/banner.jpg');opacity: 0.2;" data-swiper-parallax="-23%"></div>
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <div class="title" data-swiper-parallax="-100">微宝贝上线了</div>
                <div class="text">
                    <span class="text" data-swiper-parallax="-300">
                        <img src="mobile/baby/image/banner/image1.jpg" style="height: 100px;" class="img-thumbnail">
                        <img src="mobile/baby/image/banner/image2.jpg" style="height: 100px;" class="img-thumbnail">
                    </span>
                </div>
            </div>
            <div class="swiper-slide">
                <div class="title" data-swiper-parallax="-100">之后我想个方法</div>
                <div class="text" data-swiper-parallax="-200">
                    <p>写文字也没问题,我这里懒省事直接往后加空格</p>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="mobile/baby/image/banner/image3.jpg" style="height: 100px;" class="img-thumbnail">
                </div>
            </div>
            <div class="swiper-slide">
                <div class="title" data-swiper-parallax="-100">试一试图片的效果</div>
                <div class="text" data-swiper-parallax="-300">
                    &nbsp;<img src="mobile/baby/image/banner/image1.jpg" style="height: 100px;" class="img-thumbnail">
                </div>
            </div>
        </div>
        <div class="swiper-pagination"></div>
        <%--<div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>--%>
    </div>
</header>

<section id="home" class="container-fluid">
    <br>
    <div class="row">
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-area-chart">
                    <span>园区介绍</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-ship">
                    <span>师资力量</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-leaf">
                    <span>教学特色</span>
                </i>
            </div>
        </div>
    </div>
    <br>
    <div class="row">
        <div class="col-xs-4">
            <div class="home-item active">
                <i class="fa fa-photo">
                    <span>班级相册</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-cutlery">
                    <span>每周食谱</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-edit">
                    <span>招生简章</span>
                </i>
            </div>
        </div>
    </div>
    <br>
    <div class="row">
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-gift">
                    <span>精彩活动</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-commenting">
                    <span>通知公告</span>
                </i>
            </div>
        </div>
        <div class="col-xs-4">
            <div class="home-item">
                <i class="fa fa-user-plus">
                    <span>在线报名</span>
                </i>
            </div>
        </div>
    </div>
</section>

<script src="mobile/baby/js/baby.js"></script>
<script>
    $(document).ready(function () {
        babyMaster.preLoader();
        babyMaster.swiperHead();
    });
</script>
</body>
</html>